import React from 'react';
import ChildrenF from './component/ChidrenF'


export default class Index extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            title: 'hello ',
            text: 'world',
            value: '', 
        }
    }

    handleChange = (e) => {
        this.setState({
            value: e.target.value
        })
    }

    handleSubmit = (event) => {
        alert('提交的名字: ' + this.state.value);
        event.preventDefault();
      }


    render() {
        const {title, text} = this.state;
        return (
            <div>
                <h3>嘘唏组件通信</h3>
                <ChildrenF {...{title, text}} />

                <form onSubmit={this.handleSubmit}>
                    <label>
                        名字：
                        <input type="text" value={this.state.value} onChange={this.handleChange} />
                    </label>
                    <input type='submit' value="提交" />
                </form>
            </div>
        )
    }
}